import "../styles/MySecKill.scss"
import React, { Component } from 'react';
import pic from '../assets/01-首页-快捷入口_banner2.png'
import pic2 from '../assets/01-首页-快捷入口_03.png'

class MySecKill extends Component {
    // 定义组件状态写法二:
    constructor(props) {
        super(props);
        this.state = { //state中保存的值就是组件的状态
            list: [
                { pic2, historyPrice:'￥303',price:'￥195' ,text: '护肤' }, { pic2, historyPrice:'￥303',price:'￥195' ,text: '彩妆' }, { pic2, historyPrice:'￥303',price:'￥195' ,text: '香氛' },
                { pic2, historyPrice:'￥303',price:'￥195' ,text: '进口酒' }, { pic2, historyPrice:'￥303',price:'￥195' ,text: '国产酒' }, { pic2, historyPrice:'￥303',price:'￥195' ,text: '精品奢货' },
                { pic2, historyPrice:'￥303',price:'￥195' ,text: '食品百货' }, { pic2, historyPrice:'￥303',price:'￥195' ,text: '母婴专区' }, { pic2, historyPrice:'￥303',price:'￥195' ,text: '直播专区' },
            ]
        }
    }
    render() {
        return (
            <div className="seckill">
                <div className="img">
                    <img src={pic} alt="" />
                </div>
                <div className="list2">
                    {
                        this.state.list.map((item, index) => {
                            return (
                                <div className="item" key={index}>
                                    <img src={item.pic2} alt="" />
                                    <span>{item.text}</span>
                                    <span className="s1">{'原价'+item.historyPrice}</span>
                                    <span className="s1">{'抢购价'+item.price}</span>
                                </div>
                            )
                        })
                    }
                </div>

            </div>
        );
    }
}

export default MySecKill;
